import { defineComponent, reactive, ref } from "vue";
import Page from "@/components/public/page/page";
import { CardWithTitle } from "@/components/public/card/card";
import LTable from "@/components/public/lTable/lTable";
import { CircleStateTitle } from "@/components/public/dotStateTitle/dotStateTitle";
import channelAuditingService from "@/modules/channelManagement/channelAuditing.service";
import { message, Modal } from "ant-design-vue";
import { $agencyDoCheck } from "@/api/channelAuditing/channelAuditing";
import styles from "./channelAuditing.module.less";
export default defineComponent({
  name: 'channelAuditing',
  setup() {
    const state = reactive({
      toolbar: {
        left: ["refresh",],
        right: ["filter", "search"],
      },
      dataSource: [],
      columns: [
        {
          title: "Id",
          dataIndex: "id",
          key: "id",
          align: "center",
          width: "50px",
        },
        {
          title: "企业名称",
          dataIndex: "name",
          align: "center",
          width: "200px",
        },
        {
          title: "信用代码",
          dataIndex: "code",
          align: "center",
          width: "150px",
        },
        {
          title: "联系人",
          dataIndex: "contact_person",
          align: "center",
          width: "100px",
        },
        {
          title: "联系人手机号",
          dataIndex: "contact_phone",
          align: "center",
          width: "120px",
        },
        {
          title: "状态",
          dataIndex: "status",
          align: "center",
          width: "100px",
        },
        {
          title: "审核状态",
          dataIndex: "verify_status",
          align: "center",
          width: "120px",
        },
        {
          title: "地址",
          dataIndex: "address",
          align: "center",
          width: "140px",
        },
        {
          fixed: "right",
          title: "操作",
          dataIndex: "operation",
          align: "center",
          width: "160px",
        },
      ],
      loading: false,
      searchForm:{
        name: {
          type: "input",
          label: "企业信息",
          attrs: { placeholder: "请输入企业信息" },
        },
        code: {
          type: "input",
          label: "信用代码",
          attrs: { placeholder: "请输入信用代码" },
        },
        contact_person: {
          type: "input",
          label: "联系人",
          attrs: { placeholder: "请输入联系人" },
        },
        contact_phone: {
          type: "input",
          label: "联系人手机号",
          attrs: { placeholder: "请输入联系人手机号" },
        },
      },
      pagination: {
        total: 0,
        current: 1,
        pageSize: 10,
      },
    } as any);
    const LTableRef = ref(null as any);
    const $service = new channelAuditingService();

    return () => (
      <Page>
        <CardWithTitle title="渠道审核">
          <LTable
            ref={LTableRef}
            toolbar={state.toolbar}
            service={$service}
            v-model={state}
          >
            <a-table
              bordered={true}
              scroll={{ x: "max-content" }}
              dataSource={state.dataSource}
              columns={state.columns}
              pagination={state.pagination}
              loading={state.loading}
              v-slots={{
                bodyCell: ({ column, record }: any) => {
                  //操作
                  if (column.dataIndex === "operation") {
                    return (
                      <div class="operation">
                        {
                          record.verify_status.value === 10 && (
                            <div>
                              <a-button
                                type="primary"
                                size="small"
                                onClick={() => {
                                  Modal.confirm({
                                    title: '提示',
                                    content: '确认通过?',
                                    onOk: () => {
                                      $agencyDoCheck({
                                        agency_id:record.id,
                                        pass:1,
                                      }).then((res:any)=>{
                                        message.success('审核通过成功')
                                        LTableRef.value.$fetchTableData();
                                      })
                                    }
                                  })
                                }}
                              >
                                通过
                              </a-button>
                              <a-button
                                type="primary"
                                size="small"
                                class={styles['btn-lm']}
                                onClick={() => {
                                  Modal.confirm({
                                    title: '提示',
                                    content: '确认拒绝?',
                                    onOk: () => {
                                      $agencyDoCheck({
                                        agency_id:record.id,
                                        pass:0,
                                      }).then((res:any)=>{
                                        message.success('审核拒绝成功')
                                        LTableRef.value.$fetchTableData();
                                      })
                                    }
                                  })
                                }}
                              >拒绝</a-button>
                            </div>
                          )
                        }
                      </div>
                    )
                  }
                  //状态
                  if (column.dataIndex === "status") {
                    return (
                      record.status.value === 1 ? <CircleStateTitle title="正常" type="success" /> : <CircleStateTitle title="禁用" type="danger" />
                    )
                  }
                  //审核状态
                  if (column.dataIndex === "verify_status") {
                    switch (Number(record.verify_status.value)) {
                      case 10:
                        return <CircleStateTitle title="待审核" type="warning" />
                      case 20:
                        return <CircleStateTitle title="已审核" type="success" />
                      default:
                        return <CircleStateTitle title="审核拒绝" type="danger" />
                    }
                  }
                },
              }}
            />
          </LTable>
        </CardWithTitle>
      </Page>
    )
  }
})